<template>
    <div >
        <Form ref="fileForm" :model="fileForm">

            <FormItem >
                <span>上传文件</span>
                <Upload action="" :before-upload="handleUpload" :max-size="10" >
                    <Button icon="ios-cloud-upload-outline">选择文件上传</Button>
                </Upload>
                <div v-if="fileForm.file !== null">Upload file: {{ fileForm.file.name }}</div>
                <div v-if="download_url !== ''">下载访问地址: {{ download_url}}</div>
            </FormItem>                
        </Form>
        <Button @click="ApiTest">Api测试</Button>
        <div style="margin-bottom: 10px;height:700px;overflow:auto">
            <pre>{{data}}</pre>
        </div>
    </div>
</template>

<script>
import axios from 'axios';
import { post } from '@/api/http'


export default {
    data() {
        return {
            data: "",
            fileForm: {
                file: null
            },
            download_url: '',
        }
    },
    methods: {
        // 测试文件上传
        handleUpload (file) {
            this.fileForm.file=file;
            let filename = file.name;//取得文件的后缀名
            let formData = new FormData();
            formData.append('file_name',filename)
            formData.append('bucket_name','my-bucket1')
            formData.append('file',this.fileForm.file)
            axios({
                method: 'post',
                url: 'http://192.168.11.5:8081' + "/bucket"+"/put_object" ,
                data: formData,
                headers: {
                    'Content-Type': 'multipart/form-data;boundary = ' + new Date().getTime()
                }

            }).then( (response) => {
                console.log(response.data)
                let info = JSON.stringify(response.data)
                if(info.indexOf('ok') != -1) {
                    let download_url = response.data.download_url;
                    this.download_url = download_url
                    this.$Message.success('上传成功')
                }else {
                    this.$Message.error('上传失败')
                }
            })

            // 这里是false 则文件处理函数失效了
            return false;
        },
        ApiTest() {
            let headers = {"cluster_name": 'k8s_cs1' }
            // let data = {"namespace":'ms-prod','name':'flask-api-vs'}
            let url = 'http://192.168.11.5:8082' + "/k8s"+"/get_custom_object" 

            post(url,undefined,headers,5000).then( response => {
                this.data  = response.data
            })
        }
    },
    mounted: function() {
        // this.refresh();
    }
}
</script>
<style>
/* body{
    overflow:auto;
} */
</style>